<!DOCTYPE>
<html xmlns="http://www.w3.org/1999/xhtml">
<head lang="en">
    {include file="common_header"}
    <title>骑手评论统计</title>
</head>
<body>
<!--header结束-->
<div style="width: 100%;background-color: #fff;">
    <div style="float: left;margin: 50px 460px">
        <div >
            <span class="text-c" >
             <label >骑手：</label>
             <select id="selects" style="width:100px;height:30px">
                {volist name="rider" id="class"}
                      <option value ="{$class['id']}" >{$class['realname']}</option>
                {/volist}
             </select>
            </span>
            <input type="text" onfocus="WdatePicker()" value="{$begin}" placeholder="开始时间" id="begin" class="input-text Wdate" style="width:250px;">
            --
            <input type="text" onfocus="WdatePicker()"  value="{$end}" placeholder="结束时间" id="end"  class="input-text Wdate" style="width:250px;">
            <button type="button" class="btn btn-success" onclick="reload()"><i class="Hui-iconfont">&#xe665;</i> 搜索</button>
         </div>

    </div>
    <div style=" width:1000px;margin:40px auto 0;height: 500px;" id="main">

    </div>
</div>
{include file='common_footer'}
<script type="text/javascript" src="__AJS__echarts.min.js" ></script>
<script type="text/javascript">
    var myCharta = echarts.init(document.getElementById('main'));
    var option = {
        title : {
            text: '骑手评论列表',
        },
        tooltip : {
            trigger: 'axis'
        },
        legend: {
            data:['订单数','被评论数','服务星值','物流星值']
        },
        toolbox: {
            show : true,
            feature : {
                dataView : {show: true, readOnly: false},
                magicType : {show: true, type: ['line', 'bar']},
                restore : {show: true},
                saveAsImage : {show: true}
            }
        },
        calculable : true,
        xAxis : [
            {
                type : 'category',
                data : {$timelists}
            }
        ],
        yAxis : [
            {
                type : 'value'
            }
        ],
        series : [
            {
                name:'订单数',
                type:'bar',
                data:{$num},
                markPoint : {
                    data : [
                        {type : 'max', name: '最大值'},
                        {type : 'min', name: '最小值'}
                    ]
                },
                // markLine : {
                //     data : [
                //         {type : 'average', name: '平均值'}
                //     ]
                // }
            },
            {
                name:'被评论数',
                type:'bar',
                data:{$remarknum},
                markPoint : {
                    data : [
                        {type : 'max', name: '最大值'},
                        {type : 'min', name: '最小值'}
                    ]
                },
                // markLine : {
                //     data : [
                //         {type : 'average', name: '平均值'}
                //     ]
                // }
            },
            {
                name:'服务星值',
                type:'bar',
                data:{$man},
                markPoint : {
                    data : [
                        {type : 'max', name: '最大值'},
                        {type : 'min', name: '最小值'}
                    ]
                },
                // markLine : {
                //     data : [
                //         {type : 'average', name: '平均值'}
                //     ]
                // }
            },
            {
                name:'物流星值',
                type:'bar',
                data:{$spe},
                markPoint : {
                    data : [
                        {type : 'max', name: '最大值'},
                        {type : 'min', name: '最小值'}
                    ]
                },
                // markLine : {
                //     data : [
                //         {type : 'average', name: '平均值'}
                //     ]
                // }
            }

        ]
    };
    // 为echarts对象加载数据
    myCharta.setOption(option);
    //绑定图表resize事件
    window.addEventListener("resize", function () {
        myCharta.resize();
    });

    function reload(){
        var start=$("#begin").val();
        var end=$("#end").val();
        var id = $("#selects option:selected").val();//骑手id
        var url = "{:url('saletop/ridersta')}";
        $.ajax({
            url: url,
            data:{r_id:id,start:start,end:end},
            dataType:'json',
            type:'post',
            success: function (data) {
                console.log(data.timelists);
                option.xAxis[0]['data']= data.timelists;
                option.series[0]['data']= data.num;
                option.series[1]['data']=data.remarknum;
                option.series[2]['data']=data.man;
                option.series[3]['data']=data.spe;
                myCharta.setOption(option);
            },
            error: function () {
                layer.msg('网络错误，请稍后重试',{icon:2});
            }
        });
    }

</script>
</body>
</html>